<?php
session_start();
session_destroy();
unset($_SESSION['username']);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />  
        <title>Railway Official Website</title>
        <link rel="stylesheet" href="css/foundation.css"/>
        <link rel="stylesheet" href="css/normalize.css"/>
        <link rel="stylesheet" href="css/jquery-ui.css" />
        <script src="js/vendor/jquery.js"></script>
        <script src="js/ui/jquery-ui.js"></script>
        <script src="js/vendor/custom.modernizr.js"></script>
    </head>
    <body>
        <div>
            <nav class="top-bar">
                <ul class="title-area">
                    <li class="name" onClick="void(0);">
                        <h1><a href="#">Railway Official Website</a></h1>
                    </li>
                    <li class="divider"></li>
                    <li class="toggle-topbar menu-icon">
                        <a href="#"><span>menu</span></a>
                    </li>
                </ul>
                <section class="top-bar-section">
                    <ul class="right">
                        <li class="divider"></li>
                        <li><a href="index.php">Home</a></li>
                        <li class="divider"></li>
                        <li><a href="#">Forum</a></li>
                        <li class="divider"></li>
                        <li><a href="loginPage.php">Login</a></li>
                        <li class="divider"></li>
                    </ul>
                </section>
            </nav>
        </div>
        <div class="row">
            <div class="large-8 panel columns large-offset-2">
                <script>
                        var counter = 5;
                        var timer = setInterval(function() {
                            console.log(counter);
                            counter--;
                            if (counter == -1) {
                                clearInterval(timer);
                                window.location.replace('index.php');
                            } else {
                                document.getElementById("count").innerHTML = counter;
                            }
                        }, 1000);
                </script>
                <p>You have been successfully logged out. Redirecting you to home page in <span id="count">5</span> seconds...</p>
                <p><a href="index.php">Click here if the page did not redirect you automatically</a></p>
            </div>
        </div>
        <footer class="row">
            <div class="large-12 columns">
                <hr />
                <div class="row">
                    <div class="large-4 columns">
                        <p>&copy; Copyright 2013.</p>
                    </div>
                    <div class="large-6 columns">
                        <ul class="inline-list right">
                            <li><a href="aboutus.php">About Us</a></li>
                            <li><a href="contactus.php">Contact Us</a></li>
                            <li><a href="terms.php">Terms and Condition</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </footer>
        <script src="js/foundation.min.js"></script>
        <script>
            $(document).foundation();
        </script>
    </body>
</html>